@use 'themes';

// 通用ui整体调整
.el-header {
	--el-header-padding: 0 !important;
	--el-header-height: 60px !important;
}

.el-drawer__header {
	font-size: 24px !important;
	outline: none;
	border-bottom: 1px solid var(--el-border-color-light) !important;

	.el-drawer__title {
		font-size: 1.5rem;
	}

	.el-drawer__close-btn > .el-icon {
		font-size: 20px;
	}
}

.el-menu {
	border-right: 0;

	.el-dropdown-link {
		cursor: pointer;
	}

	.ArrowDown {
		font-size: 12px;
	}

	.el-menu-item.is-active {
		background-color: var(--el-menu-active-bg-color, var(--el-menu-hover-bg-color)) !important;
		border-radius: 0 50px 50px 0;
		// &:before {
		// 	content: '';
		// 	position: absolute;
		// 	inset: 0 0;
		// 	width: 6px;
		// 	height: 100%;
		// 	background: #0339ab;
		// 	border-radius: 0 4px 4px 0;
		// }
	}

	.el-sub-menu,
	.el-menu-item {
		.my-icon {
			margin-top: -4px;
			margin-right: 0;
			font-size: var(--el-menu-icon-size, 24px) !important;
		}
	}
}

.el-menu--horizontal {
	height: var(--el-header-height);
	border-bottom: 0;

	& > .el-sub-menu .el-sub-menu__title:hover {
		background-color: var(--el-menu-hover-bg-color);
	}
}

.el-menu--horizontal > .el-menu-item.is-active,
.el-menu--horizontal > .el-sub-menu.is-active .el-sub-menu__title {
	border-bottom: 4px solid var(--el-menu-active-color) !important;
}

.el-menu--collapse {
	.el-sub-menu,
	.el-menu-item {
		padding: 0 !important;

		&__title {
			padding: 0 !important;
		}

		.my-icon {
			margin: 0 auto !important;
			font-size: var(--el-menu-icon-size-collapse) !important;
		}
	}
}

// form表单的问题
.myQueryForm {
	.el-input__inner {
		width: 100%;
	}

	.el-form-item__label {
		display: flex;
		justify-content: space-between;
	}
}

@media screen and (width <= 1920px) {
	.myQueryForm {
		margin-bottom: -18px !important;
	}

	.el-form {
		margin-bottom: 0;
	}
}

@media screen and (width >= 1921px) {
	.myQueryForm {
		margin-bottom: -22px !important;
	}

	.el-form {
		margin-bottom: 0;
	}
}

.el-form--inline .el-form-item {
	margin-right: 10px !important;
}

.el-select,
.el-cascader,
.el-input-number {
	width: 100%;
}

.el-form--label-top .el-form-item__label {
	padding: 0;
}

// bialog
.el-dialog {
	border-radius: var(--el-border-radius-base) !important;

	.el-dialog__header {
		padding: 0 16px var(--el-dialog-padding-primary);
		margin: 0 -16px;
		border-bottom: 1px solid #d3d3d9;

		.el-dialog__title {
			font-weight: 600;
		}
	}

	.el-dialog__headerbtn {
		top: 0;
		width: 50px;
		height: 50px;
		font-size: var(--el-message-close-size, 20px);
	}

	.el-dialog__body {
		padding: 10px;
	}

	.el-dialog__footer {
		padding-top: 0;
	}
}

.el-message-box__header {
	.el-dialog__header {
		border-bottom: 1px solid var(--el-color-primary);

		.el-dialog__title {
			font-weight: bolder;
		}

		.el-dialog__headerbtn {
			font-size: 20px;

			.el-dialog__close {
				font-size: 18px;
			}
		}
	}

	.el-dialog__footer {
		border-top: 1px dashed var(--el-color-primary);
	}

	.el-message-box__header {
		border-bottom: 1px solid var(--el-color-primary);
	}
}

// 级联选择框(单选)
.el-cascader-panel {
	.el-radio {
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
	}

	.el-radio__input {
		visibility: hidden;
	}

	.el-cascader-node__postfix {
		top: 10px;
	}

	.el-cascader-menu__list {
		max-height: 400px;
	}
}

.el-select .el-input__inner {
	padding-right: 30px;
}

.el-radio-button__inner {
	font-weight: 700;
}

.el-cascader-node:has(.is-disabled) {
	font-weight: 400 !important;
	color: var(--el-cascader-node-color-disabled) !important;
	cursor: not-allowed !important;

	.is-disabledf {
		cursor: not-allowed !important;
	}
}

// 按钮部分
.el-button + .el-button-group,
.el-button-group + .el-button,
.el-button-group + .el-button-group {
	margin-left: 10px;
}

// 表格
.el-table {
	--el-table-header-bg-color: var(--el-fill-color-light, var(--el-border-color-lighter)) !important;

	&__body,
	&__footer,
	&__empty-block,
	&__header {
		width: 100% !important;
	}
}

// 抽屉
.el-drawer {
	--el-drawer-background-color: var(--el-dialog-background-color, var(--el-color-white));
	--el-drawer-padding-primary: var(--el-dialog-padding-primary, 20px);

	.el-drawer__body {
		display: flex;
		flex: 1;
		flex-direction: column;
		height: 0;
		padding: 0;
	}

	.el-drawer__header {
		padding-bottom: var(--el-drawer-padding-primary);
		margin-bottom: 20px;
		margin-bottom: 0;
		font-size: 18px;
		font-weight: 900;
		border-bottom: 1px solid var(--el-button-border-color, var(--el-border-color-base));
	}
}

// 标签
.el-tabs__item {
	font-size: 16px;

	.is-active {
		font-weight: bold;
	}
}

.el-page-header__left {
	margin-right: 20px !important;
	color: var(--el-color-primary);
	transition: all 0.3s;

	.el-page-header__icon {
		margin-right: 0;
	}

	.el-page-header__title {
		font-size: 16px;
	}

	&::after {
		right: -10px !important;
		background-color: var(--el-color-primary) !important;
		transform: translateY(-50%) rotate(19deg) !important;
	}

	&:hover {
		transform: translateX(-5px);
	}
}

.el-page-header__content {
	font-weight: 900;
}

.el-popover.proppper-class {
	padding: 12px 0 0;
	border: none;
	border-radius: 4px;
	box-shadow: 0 4px 16px 0 rgb(179 192 231 / 32%);
}

.el-form-item__label {
	align-items: center !important;
	color: var(--el-text-color-primary) !important;
}

// 下拉菜单，黑框问题
:focus,
:focus-visible {
	outline: none;
}

// icon 未对齐的问题
.el-icon {
	vertical-align: middle;
}
